<template>
    <div>
    <div class="outmain ba_f formwidth">
        <div class="shuju_title mar_b20">
            <div class="shuju_title_text">
                <span>百度小程序模板消息</span>
            </div>
        </div>
        <div>
            <el-form ref="form2" :model="form2" label-width="180px" class="mar_t20">
                <el-form-item label="下单成功通知" :required="true">
                    <el-input v-model="form.name" placeholder="请输入模板ID" ></el-input>
                    <el-button class="mar_l20"  v-popover:popover2>查看订阅消息示例</el-button>
                    <el-popover ref="popover2" placement="top-start" title="订单拒绝接单通知" width="250" trigger="hover">
                        <div class="orderpop fon_12">
                            <p>您的订单被拒绝接单</p>
                            <p>订单金额：45.22</p>
                            <p>订单名称：确认您已获得模板消息</p>
                            <p>下单时间：2019-08-24 11:45:14</p>
                            <p>订单状态：已拒单</p>
                        </div>
                    </el-popover>
                </el-form-item>
                <el-form-item label="商家拒单通知" :required="true">
                    <el-input v-model="form2.name" placeholder="请输入模板ID" ></el-input>
                    <el-button class="mar_l20">查看订阅消息示例</el-button>
                </el-form-item>
                <el-form-item label="商家接单通知" :required="true">
                    <el-input v-model="form2.name" placeholder="请输入模板ID" ></el-input>
                    <el-button class="mar_l20">查看订阅消息示例</el-button>
                </el-form-item>
                <el-form-item label="申请退款通知" :required="true">
                    <el-input v-model="form2.name" placeholder="请输入模板ID" ></el-input>
                    <el-button class="mar_l20">查看订阅消息示例</el-button>
                </el-form-item>
                <el-form-item label="退款通知" :required="true">
                    <el-input v-model="form2.name" placeholder="请输入模板ID" ></el-input>
                    <el-button class="mar_l20">查看订阅消息示例</el-button>
                </el-form-item>
                <el-form-item label="会员开通成功通知" :required="true">
                    <el-input v-model="form2.name" placeholder="请输入模板ID" ></el-input>
                    <el-button class="mar_l20">查看订阅消息示例</el-button>
                </el-form-item>
                <el-form-item label="签到提醒" :required="true">
                    <el-input v-model="form2.name" placeholder="请输入模板ID" ></el-input>
                    <el-button class="mar_l20">查看订阅消息示例</el-button>
                </el-form-item>
                <el-form-item label="充值成功通知" :required="true">
                    <el-input v-model="form2.name" placeholder="请输入模板ID" ></el-input>
                    <el-button class="mar_l20">查看订阅消息示例</el-button>
                </el-form-item>
            </el-form>
        </div>
    </div>
        <div class="mar_t20 ba_f pad_20 t_c">
            <el-button type="primary" @click="onSubmit()">保存</el-button>
        </div>
    </div>
</template>
<script>
    import {getConfig, postConfig,getPage} from "@/api/setup";
    export default {
        created() {
            // this.bus.$emit('loading', true);
            // this.init();
        },
        data() {
            return {
                activeName:'1',
                form: {
                    name: '',
                    appId: '',
                    appSecret: '',
                    originalAppId: '',
                },
                form2: {
                    name: '',
                },
                rules: {
                    name: [
                        {required: true, message: '请输入公众号名称', trigger: 'blur'},
                    ],
                    originalAppId: [
                        {required: true, message: '请输入originalAppId', trigger: 'blur'},
                    ],
                    appId: [
                        {required: true, message: '请输入AppId', trigger: 'blur'}
                    ],
                    appSecret: [
                        {required: true, message: '请输入appSecret', trigger: 'blur'}
                    ]
                },
                list: [],
                listLoading: true,
                selectRows: "",
                elementLoadingText: "正在加载...",
            }
        },
        methods: {
            async init() {

            },
            async onSubmit() {
                if (this.activeName == '1') {
                    this.$refs["form"].validate(async (valid) => {
                        if (valid) {
                            this.form.ident = 'wechatConfig'
                            this.form.identName = '公众号配置'
                            const {msg} = await postConfig(this.form);
                            this.$baseMessage(msg, "success");
                            this.init();
                        } else {
                            return false;
                        }
                    });
                }
            }
        }
    }
</script>
